.bg {
  width: 750rpx;
  height: 328rpx;
  background-size: 100% 100%;
  .bg-color {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 750rpx;
    height: 328rpx;
    background-color: rgba(33, 114, 237, 0.6);
    background-size: 100% 100%;
    .search {
      display: flex;
      width: 700rpx;
      height: 120rpx;
      // background-color: #000000;
      .sao-icon {
        margin: 10rpx 0 0 20rpx;
        width: 60rpx;
        height: 60rpx;
      }
      .search-view {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-left: 40rpx;
        width: 580rpx;
        height: 80rpx;
        background-color: rgba(255, 255, 255, 0.2);
        border-radius: 15rpx;
        .search-icon {
          width: 36rpx;
          height: 36rpx;
          opacity: 0.4;
        }
        .search-word {
          margin-left: 20rpx;
          font-size: 28rpx;
          color: #fff;
          opacity: 0.4;
        }
      }
    }
    .common {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      width: 700rpx;
      height: 120rpx;
      background-color: #ffffff;
      border-radius: 15rpx;
      .icon {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 140rpx;
        font-size: 24rpx;
        .common-icon {
          width: 64rpx;
          height: 64rpx;
        }
        .text {
          font-size: 24rpx;
        }
      }
    }
  }
}